// JavaScript Document


//Some variables importants.keep this variables here!
var animacao_continua  = null;
var img_foto           = null;
var animation          = true;
var array_img          = new Array();
var array_img_original = new Array();
var quant_imagens      = null;
var id                 = null;
var speed              = 1000;
var fotos_por_ciclo    = 7;



// begin jquery
  $(document).ready(function(){
  
  quant_imagens = $(".fotos").length;
   for( i=0 ; i < quant_imagens ; i++ )
  array_img_original[i] = $("#foto"+(i+1)).html();
  
  
  

// begin galery animation with 1 second of interval
  animacao_continua = setInterval(anima_galeria,speed);  
   
   /* here there is an event(hover) that does the function of 2 events(mouseover and mouseout).
    the first parameter calls the function stop_animation() when the event "mouseover" is fires
    and the second, calls keep_animation() when the event "mouseout" is fires.
   */
  $(".fotos").hover(stop_animation,keep_animation);
  $(".fotos").click(show_dialog);  // call the function "show_dialog" when the tg "td" is clicked
  $("#dialog").hide(); // hide the div "#dialog" first
  
  $("#previous").click(previous_image);// call the function will take the next image of array
  $("#previous").hover(stop_animation,keep_animation); 
  $("#next").click(next_image);// call the function will take the previous image of array
  $("#next").hover(stop_animation,keep_animation);
  
  $(".botao_foto").hover(stop_animation,keep_animation);
  //$(".botao_foto").mouseout(function(){alert("ola")});
  
  //reajusta_vetor_fotos
  
  
 
//  $("#foto1").mousemove(function(){
 // });

// seting the dialog box
$('#dialog').bind('dialogclose', function(event, ui) {
 animation = true;
 keep_animation();
});

  });
  
  
  function previous_image(){
  anima_galeria();
  }
  
//  take the next image of array
  function next_image(){
  
  quant_imagens = $(".fotos").length;
 
  for( i=0 ; i < quant_imagens ; i++ )
  array_img[i] = $("#foto"+(i+1)).html();
  
  for( i=quant_imagens-1 ; i >0  ; i-- ){
  if( i == quant_imagens-1 )
  $("#foto1").html(array_img[quant_imagens-1]);
  $("#foto"+(i+1)).html(array_img[i-1]);
  }
  }
  
  
  // stop the galery animation
  function stop_animation(){
 clearInterval(animacao_continua);
  }
  
  
  // start the galery animation
  function keep_animation(){
  if( animation == true )
  animacao_continua = setInterval(anima_galeria,speed); 
  }
  
  
  // show the dialog of the image selected
  function show_dialog(){
  
  var z = $("#"+id).attr("src");// take the "src" of image selected.
  var id_foto = $("#"+id).attr("alt");
  
  $("#dialog").load("formata_div_img.php?url_img="+z+"&id_foto="+id_foto); // load the page that process the informations about the image selected.
  
  //$("#dialog").html("<img src=\""+z+"\">");
  //alert(z)
 
   animation = false; // set the variable to "false" to stop the galery animation.
  $("#dialog").dialog("open"); // open dialog.
  $("#dialog").dialog("moveToTop"); 

// seting the dialog
   $("#dialog").dialog({ 
  height: 530,width:800,hide: 'slide',minWidth:600,minHeight:500 ,modal: true,show: 'slide',
  title: 'Yours Photos',stack: true,  

  });
  }
  
 
 // this function makes the galery animation.
   function anima_galeria(){
   
 // quant_imagens = $(".fotos").length;
  
  if ( quant_imagens% fotos_por_ciclo == 0 )
  quant_pag = quant_imagens/fotos_por_ciclo;
  else
  quant_pag = quant_imagens/fotos_por_ciclo+1;
  
  
  for( i=0 ; i < quant_imagens ; i++ )
  array_img[i] = $("#foto"+(i+1)).html();
  
  for( i=0 ; i < quant_imagens - 1 ; i++ ){
  
  if( i == 0 )
  $("#foto"+(quant_imagens)).html(array_img[0]);
  
  $("#foto"+(i+1)).html(array_img[i+1]);
  }
  
  }
  
  
  // Take the "id" of image selected when this image is clicked.
  function get_id (id){
  this.id = id;
//  alert(this.id); //for test.
  }
  
  function trata_botao_foto (id){
  //alert("id: "+id);
  var tamanho_array = array_img_original.length;
  var posicao_no_array =null;
  var auxi = 0;
  
  for( i=0 ; i < fotos_por_ciclo ; i++ ){
  posicao_no_array = id*fotos_por_ciclo+i;
  
  if( posicao_no_array < tamanho_array )
  $("#foto"+(i+1)).html(array_img_original[posicao_no_array]);
  else{
  $("#foto"+(i+1)).html(array_img_original[auxi]);
  ++auxi;
  }
  //$("#foto"+(i+1)).html("<img class=\"imagem\" id=\"img"+(i+1)+"\" src=\"\" />");
  }
  }
  
  
  function reajusta_vetor_fotos (){
	  
	var first_position = $(".foto1").attr("id"); 
	first_position = first_position.replace("foto","");
	alert(first_position);
	
	var last_position  = $(".foto"+fotos_por_ciclo).attr("id"); 
	last_position = last_position.replace("foto","");	
	
	
    if ( first_position == 1 )
	first_position = quant_imagens;
	if ( first_position > last_position ){
	
	
	for ( i = last_position ; i <= quant_imagens ; i++ ){
	$("#foto"+i+1).html(array_img_original[last_position]);	
		
	++last_position;
	}
	
	for( i = 1 ; i <=first_position ; i++ ){
	$("#foto"+last_position).html(array_img_original[i-1]);	
	}
		
	}
	
	
	else{
	for ( i = last_position ; i <= first_position ; i++ ){
	$("#foto"+i+1).html(array_img_original[last_position]);	
		
	++last_position;
	}
	}
	  
  }
  
  